<!-- 加载静态文件路径 -->
{% load static %}

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Demo</title>

    <!-- 引入静态文件样例 demo_clear.css 清除默认样式 -->
    <link rel="stylesheet" href="{%  static 'artworks/css/demo_clear.css' %}">
    <link rel="stylesheet" href="{%  static 'artworks/css/demo_com.css' %}">

</head>

<body>
    <p>
        <a href="/artworks/demo_bootstrap">UI框架: bootstrap</a>
        <a href="/artworks/demo_pico">UI框架: pico</a>
    </p>

    <div class="div-body">
        <div>
            <div>
                <h1>ul li ol 元素一级标题</h1>
                <p> 增加一个页面的步骤：</p>
            </div>
            <div>
                <ul>
                    <p>url -> wiews.py -> template.html</p>
                    <li>在views里写的一个处理函数,绑定函数和html模板;</li>
                    <li>在app的url里绑定url和处理函数;</li>
                    <li>url-->views 可配置url传递参数, view-->template 可配置上下文(字典类型)传递参数到网页;</li>
                </ul>
            </div>
            <hr>
        </div>
        <div>
            <div style="float: right;">
                <img src="{% static 'artworks/img/css-box.png'%}" alt="" height="400">
            </div>
            <div style="float: right;">
                <p>
                    div {
                        width: 220px;
                        padding: 10px;
                        border: 5px solid gray;
                        margin: 0; 
                    }
                </p>
            </div>
        </div>
    </div>
</body>

</html>